.t-float-left {
    float: left;
}
.t-float-right {
    float: right;
}
@keyframes tdesign-fade-out {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
.hotspot-expanded.relative {
    position: relative;
}
.hotspot-expanded::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    transform: scale(1.5);
}

.t-upload__add-icon:only-child {
    display: flex;
}
.t-upload__thumbnail {
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}
.t-upload__wrapper {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    .t-upload__wrapper--item {
        border-radius: 12rpx;
        overflow: hidden;
        position: relative;
        margin-right: 16rpx;
        margin-top: 16rpx;
        width: 190rpx;
        height: 190rpx;
    }
}

.t-upload__close-btn {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40rpx;
    height: 40rpx;
    border-top-right-radius: var(
        --td-upload-radius,
        var(--td-radius-default, 12rpx)
    );
    border-bottom-left-radius: var(
        --td-upload-radius,
        var(--td-radius-default, 12rpx)
    );
    background-color: var(--td-font-gray-3, rgba(0, 0, 0, 0.4));
}
.t-upload__progress-mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--td-font-gray-3, rgba(0, 0, 0, 0.4));
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: var(--td-upload-radius, var(--td-radius-default, 12rpx));
    color: var(--td-font-white-1, #ffffff);
    padding: 32rpx 0;
}
.t-upload__progress-text {
    font-size: 24rpx;
    line-height: 40rpx;
    margin-top: 8rpx;
}
.t-upload__progress-loading {
    animation: spin infinite linear 0.6s;
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
